<template>
  <view class="about-us">
    <u-navbar
      :title="$t('setting.AboutOmlook')"
      bgColor="#F6F6F6"
      :autoBack="false"
			@leftClick="gotoBack"
      titleStyle="font-size: 32rpx;font-weight: 500;color: #000000;"
      :placeholder="true"
    >
    </u-navbar>
    <view class="content-view">
      <view class="img-view">
        <image src='@/static/app_icon.png' class="app_icon"/>
        <view class="title">Omlook</view>
      </view>
      <view class="about-content">
        <view class="Agreement" @click="gotoPage('/pages/user/AboutDetailUser')">
          <view class="content-title">{{ $t('setting.UserAgreement') }}</view>
          <view class="iconfont icon-jiantou-you arrow-icon"></view>
        </view>
        <view class="Agreement" @click="gotoPage('/pages/user/AboutDetailPrivacy')">
          <view class="content-title">{{ $t('setting.PrivacyAgreement') }}</view>
          <view class="iconfont icon-jiantou-you arrow-icon"></view>
        </view>
        <view class="Agreement">
          <view class="content-title">{{ $t('setting.Version') }}</view>
          <view class="arrow-icon">v1.0.2</view>
        </view>
      </view>
    </view>
    <view class="Copyright">Copyright © 2023 Omlook All Rights Reserved.</view>
  </view>
</template>

<script>
  export default {
    methods: {
			// 返回上一页
			gotoBack() {
				uni.switchTab({
					url: '/pages/user/User'
				});
			},
			gotoPage(url) {
				uni.navigateTo({
					url
				})
			}
		}
  }
</script>

<style lang="scss" scoped>
.content-view{
  box-sizing: border-box;
  padding: 140upx 30upx 30upx;
  .img-view{
    text-align: center;
  }
  .app_icon{
    width: 308upx;
    height: 308upx;
  }
  .title{
    font-size: 44upx;
    font-weight: 400;
    color: #000000;
  }
  .about-content{
    width: 100%;
    background: #FFFFFF;
    border-radius: 20px;
    margin-top: 100upx;
    box-sizing: border-box;
    padding: 0 30upx;
    .Agreement{
      padding: 36upx 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 2upx solid #F6F6F6;
    }
    .content-title{
      font-size: 30upx;
      font-weight: 400;
      color: #000000;
    }
    .arrow-icon{
      color:#A6A6A6 ;
    }
  }
}
.Copyright{
  text-align: center;
  font-size: 24upx;
  font-weight: 400;
  color: #878787;
  margin-top: 340upx;
  padding-bottom: 160upx;
}
</style>